<extend name="extends/extend" />
<block name="loadCss">
</block>
<block name="script">
    <!--表单验证 插件-->
    <script src="__admin__/js/plugins/validate/jquery.validate.min.js"></script>
    <script src="__admin__/js/plugins/validate/messages_zh.min.js"></script>
    <script>
        $(document).ready(function () {
            $('#checkForm').validate({
                submitHandler:function(form) {
                    form.submit();
                },
                highlight: function(e) {
                    $(e).closest(".form-group").removeClass("has-success").addClass("has-error")
                },
                success: function(e) {
                    e.closest(".form-group").removeClass("has-error")
                },
                errorClass: "help-block m-b-none",
                rules:{
                    status:{required:true}
                }
            });
            $('textarea[name=template]').val($('#type option:selected').data('template'));
            $('#type').on('change',function () {
                $('textarea[name=template]').val($(this).find('option:selected').data('template'));
            })

        });
    </script>
</block>
<block name="content">
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
            <div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>新增广告位</h5>
                        <div class="ibox-tools">
                            <a href="javascript:history.go(-1);" class="btn btn-outline btn-info btn-xs">
                                <i class="fa fa-arrow-circle-left"></i> 返回
                            </a>
                        </div>
                    </div>
                    <div class="ibox-content">
                        <form method="post" action="" class="form-horizontal" id="checkForm">
                            <div class="form-group">
                                <label class="col-sm-2 control-label">广告位</label>
                                <div class="col-sm-10">
                                    <input type="text" name="name"  required class="form-control">
                                </div>
                            </div>
                            <div class="hr-line-dashed"></div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">广告类型</label>
                                <div class="col-sm-10">
                                    <select class="form-control m-b" id="type" required name="type">
                                        <volist name="type" id="v">
                                            <option data-template="{:htmlspecialchars($v.template)}" value="{$key}">{$v.text}</option>
                                        </volist>
                                    </select>
                                </div>
                            </div>
                            <div class="hr-line-dashed"></div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">尺寸</label>
                                <div class="col-sm-10">
                                    <div class="input-group" style="width: 300px;">
                                        <div class="input-group-addon">宽</div>
                                        <input type="text" class="form-control" required name="width"  value="0">
                                        <div class="input-group-addon">像素</div>
                                    </div>
                                    <div class="input-group" style="width: 300px;">
                                        <div class="input-group-addon">高</div>
                                        <input type="text" class="form-control" required name="height"  value="0">
                                        <div class="input-group-addon">像素</div>
                                    </div>
                                </div>
                            </div>
                            <div class="hr-line-dashed"></div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">显示广告数</label>
                                <div class="col-sm-10">
                                    <div class="input-group" style="width: 300px;">
                                        <input type="text" class="form-control" required value="1" name="view_num">
                                        <div class="input-group-addon">条</div>
                                    </div>
                                </div>
                            </div>
                            <div class="hr-line-dashed"></div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">标签</label>
                                <div class="col-sm-10">
                                    <input type="text" name="tab"  class="form-control">
                                </div>
                            </div>
                            <div class="hr-line-dashed"></div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">模板</label>
                                <div class="col-sm-10">
                                    <textarea  name="template"  class="form-control"></textarea>
                                    <span class="help-block m-b-none">可用字段: [ $title ]为标题，[ $content ]为图片地址或文本内容或动画地址
[ $url ]为链接地址，[ $width ]为广告宽度,[ $height ]为广告高度</span>
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="col-sm-4 col-sm-offset-2">
                                    {:token()}
                                    <button class="btn btn-primary" type="submit">保存</button>
                                    <button class="btn btn-primary" type="reset">重置</button>
                                    <button class="btn btn-primary" type="button" onclick="history.go(-1)">返回</button>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</block>